<script setup lang="ts">
import CoachForm from "@/coachfinder/components/coaches/CoachForm.vue";
import BaseCard from "@/coachfinder/components/ui/BaseCard.vue";
import { useRouter } from "vue-router";
import { useStore } from "vuex";

const store = useStore();
const router = useRouter();

const saveData = async function (data) {
  store.dispatch("registerCoach", data);
  router.replace("/coaches");
};
</script>

<template>
  <section>
    <BaseCard>
      <h2>Register as a coach now!</h2>
      <CoachForm @save-data="saveData"></CoachForm>
    </BaseCard>
  </section>
</template>
